<template>
  <el-dialog
    :title="!dataForm.id ? '新增' :detail? '详情' : '修改'"
    :close-on-click-modal="false"
    :visible.sync="visible">
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()"
             label-width="80px">
      <el-row>
        <el-col :span="12">
          <el-form-item label="识别文件" v-show="!detail" prop="fileUrl">
            <!--            <el-input v-model="dataForm.fileUrl" placeholder="源文件地址"></el-input>-->
            <el-upload ref="myUpload"
                       class="avatar-uploader"
                       :action="uploadAction"
                       :headers="headers"
                       :limit="1"
                       :on-success="handleAvatarSuccess"
                       :before-upload="beforeAvatarUpload">
              <el-button size="small" type="primary">点击上传</el-button>
            </el-upload>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="姓名" prop="name">
            <el-input v-model="dataForm.name" placeholder="姓名"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="年龄" prop="age">
            <el-input v-model="dataForm.age" placeholder="年龄"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="性别" prop="sex">
            <!--            <el-radio-group v-model="dataForm.sex">-->
            <!--              <el-radio-button label="男">男</el-radio-button>-->
            <!--              <el-radio-button label="女">女</el-radio-button>-->
            <!--            </el-radio-group>-->
            <el-radio v-model="dataForm.sex" label="男">男</el-radio>
            <el-radio v-model="dataForm.sex" label="女">女</el-radio>
            {{ dataForm.sex }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="籍贯" prop="nativePlace">
            <el-input v-model="dataForm.nativePlace" placeholder="籍贯"></el-input>
          </el-form-item>
        </el-col>

      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="学历" prop="education">
            <!--            <el-input v-model="dataForm.education" placeholder="学历"></el-input>-->
            <el-select v-model="dataForm.education" placeholder="请选择学历">
              <el-option v-for="item in educationList" :key="item.id" :value="item.education" :label="item.education">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="求职意向" prop="physicalCondition">
            <el-input v-model="dataForm.physicalCondition" placeholder="求职意向"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="专业" prop="major">
            <el-input v-model="dataForm.major" placeholder="专业"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="工作年限" prop="workYears">
            <el-input v-model="dataForm.workYears" placeholder="工作年限"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="毕业学校" prop="graduationSchool">
            <el-input v-model="dataForm.graduationSchool" placeholder="毕业学校"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="就读时间" prop="studyTime">
            <el-input v-model="dataForm.studyTime" placeholder="就读时间"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="联系方式" prop="phone">
            <el-input v-model="dataForm.phone" placeholder="联系方式"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="邮箱" prop="email">
            <el-input v-model="dataForm.email" placeholder="邮箱"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="身高" prop="height">
            <el-input v-model="dataForm.height" placeholder="身高"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="体重" prop="weight">
            <el-input v-model="dataForm.weight" placeholder="体重"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="qq号" prop="qq">
            <el-input v-model="dataForm.qq" placeholder="qq号"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="微信号" prop="wx">
            <el-input v-model="dataForm.wx" placeholder="微信号"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="备注" prop="notes">
        <el-input v-model="dataForm.notes" placeholder="备注"></el-input>
      </el-form-item>
      <el-row>
        <!--        <el-col :span="12">-->
        <!--          <el-form-item label="部门编号" prop="departmentId">-->
        <!--            <el-input v-model="dataForm.departmentId" placeholder="部门编号"></el-input>-->
        <!--          </el-form-item>-->
        <!--        </el-col>-->
        <el-col :span="24">
          <el-form-item label="选择部门" prop="departmentName">
            <el-popover
              ref="menuListPopover"
              placement="bottom-start"
              trigger="click">
              <el-tree
                :data="menuList"
                :props="menuListTreeProps"
                node-key="menuId"
                ref="menuListTree"
                @current-change="menuListTreeCurrentChangeHandle"
                :default-expand-all="true"
                :highlight-current="true"
                :expand-on-click-node="false">
              </el-tree>
            </el-popover>
            <el-input v-model="dataForm.departmentName" v-popover:menuListPopover :readonly="true" placeholder="点击选择部门"
                      class="menu-list__input"></el-input>
          </el-form-item>
        </el-col>
        <!--        <el-col :span="12">-->
        <!--          <el-form-item label="部门名称" prop="departmentName">-->
        <!--            <el-input v-model="dataForm.departmentName" placeholder="部门名称"></el-input>-->
        <!--          </el-form-item>-->
        <!--        </el-col>-->
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="教育背景" prop="skill">
            <el-input type="textarea" :rows="4" v-model="dataForm.skill" placeholder="教育背景"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="工作经历" prop="workExperience">
            <el-input type="textarea" :rows="4" v-model="dataForm.workExperience" placeholder="工作经历"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="自我评价" prop="introduce">
            <el-input type="textarea" :rows="4" v-model="dataForm.introduce" placeholder="自我评价"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-col :span="24">
        <el-form-item label="状态" prop="status">
          <el-select v-model="dataForm.status" placeholder="状态">
            <el-option value="待审核">待审核</el-option>
            <el-option value="通过">通过</el-option>
            <el-option value="未通过">未通过</el-option>
          </el-select>
        </el-form-item>
      </el-col>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" v-if="!detail" @click="dataFormSubmit()">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import Vue from "vue";
import {getFileAccessHttpUrl} from '@/utils/manage';
import {treeDataTranslate} from '@/utils'

export default {
  data() {
    return {
      visible: false,
      uploadAction: window.SITE_CONFIG['baseUrl'] + "/resume/resume/upload",
      headers: {},
      dataForm: {
        id: 0,
        name: '',
        sex: '',
        age: '',
        workYears: '',
        education: '',
        physicalCondition: '',
        major: '',
        weight: '',
        nativePlace: '',
        introduce: '',
        graduationSchool: '',
        studyTime: '',
        workExperience: '',
        phone: '',
        email: '',
        qq: '',
        wx: '',
        skill: '',
        fileUrl: '',
        notes: '',
        departmentId: '',
        departmentName: '',
        status: ''
      },
      dataRule: {
        name: [
          {required: true, message: '姓名不能为空', trigger: 'blur'}
        ],
        sex: [
          {required: true, message: '性别不能为空', trigger: 'blur'}
        ],
        age: [
          {required: true, message: '年龄不能为空', trigger: 'blur'}
        ],
        workYears: [
          {required: true, message: '工作年限不能为空', trigger: 'blur'}
        ],
        education: [
          {required: true, message: '学历不能为空', trigger: 'blur'}
        ],
        physicalCondition: [
          {required: true, message: '求职意向不能为空', trigger: 'blur'}
        ],
        major: [
          {required: true, message: '专业不能为空', trigger: 'blur'}
        ],
        // height: [
        //   {required: true, message: '身高不能为空', trigger: 'blur'}
        // ],
        // weight: [
        //   {required: true, message: '体重不能为空', trigger: 'blur'}
        // ],
        nativePlace: [
          {required: true, message: '籍贯不能为空', trigger: 'blur'}
        ],
        introduce: [
          {required: true, message: '自我评价不能为空', trigger: 'blur'}
        ],
        graduationSchool: [
          {required: true, message: '毕业学校不能为空', trigger: 'blur'}
        ],
        studyTime: [
          {required: true, message: '就读时间不能为空', trigger: 'blur'}
        ],
        workExperience: [
          {required: true, message: '工作经历不能为空', trigger: 'blur'}
        ],
        skill: [
          {required: true, message: '教育背景不能为空', trigger: 'blur'}
        ],
        phone: [
          {required: true, message: '联系方式不能为空', trigger: 'blur'}
        ],
        email: [
          {required: true, message: '邮箱不能为空', trigger: 'blur'}
        ],
        departmentId: [
          {required: true, message: '部门编号不能为空', trigger: 'blur'}
        ],
        departmentName: [
          {required: true, message: '部门名称不能为空', trigger: 'blur'}
        ],
        status: [
          {required: true, message: '状态不能为空', trigger: 'blur'}
        ]
      },
      educationList: [],
      menuList: [],
      menuListTreeProps: {
        label: 'name',
        children: 'children'
      },
      detail: false,
    }
  },
  created() {
    const token = Vue.cookie.get('token')
    this.headers = {"token": token};
    this.getdepartmentList()
    this.geteducationList()
  },
  methods: {
    // 获取学历列表
    geteducationList() {
      this.$http({
        url: this.$http.adornUrl('/resume/education/all'),
        method: 'get',
      }).then(({data}) => {
        if (data && data.code === 0) {
          this.educationList = data.data
        } else {
          this.educationList = []
        }
      })
    },
    //获取部门信息
    getdepartmentList() {
      this.$http({
        url: this.$http.adornUrl('/resume/department/list'),
        method: 'get',
        params: this.$http.adornParams({"key": ""})
      }).then(({data}) => {
        console.log('datadata', data);
        this.menuList = treeDataTranslate(data.page, 'menuId')
      })
    },
    // 菜单树选中
    menuListTreeCurrentChangeHandle(data, node) {
      this.dataForm.departmentId = data.menuId
      this.dataForm.departmentName = data.name
      // this.getDataList()
    },
    handleAvatarSuccess(res, file) {
      // this.dataForm =
      this.dataForm = res.data;
      console.log('this.dataForm.imgUrl ', this.dataForm.imgUrl);
    },
    beforeAvatarUpload(file) {
      this.dataForm.imgUrl = ''
      console.log(file);
      const isDOC = file.type === 'application/vnd.openxmlformats-officedocument.wordprocessingml.document';
      const isLt2M = file.size / 1024 / 1024 < 10;
      if (!isDOC) {
        this.$message.error('上传头像图片只能是 doc/docx 格式!');
      }
      if (!isLt2M) {
        this.$message.error('上传文件大小不能超过 10MB!');
      }
      return isDOC && isLt2M;
    },
    showDetail(flag) {
      this.detail = flag
    },
    init(id) {
      this.dataForm.id = id || 0
      this.visible = true
      this.$nextTick(() => {
        this.$refs['dataForm'].resetFields()
        this.$refs.myUpload.clearFiles()
        if (this.dataForm.id) {
          this.$http({
            url: this.$http.adornUrl(`/resume/resume/info/${this.dataForm.id}`),
            method: 'get',
            params: this.$http.adornParams()
          }).then(({data}) => {
            if (data && data.code === 0) {
              this.dataForm.name = data.resume.name
              this.dataForm.age = data.resume.age
              this.dataForm.sex = data.resume.sex
              this.dataForm.workYears = data.resume.workYears
              this.dataForm.education = data.resume.education
              this.dataForm.physicalCondition = data.resume.physicalCondition
              this.dataForm.major = data.resume.major
              this.dataForm.height = data.resume.height
              this.dataForm.weight = data.resume.weight
              this.dataForm.nativePlace = data.resume.nativePlace
              this.dataForm.introduce = data.resume.introduce
              this.dataForm.graduationSchool = data.resume.graduationSchool
              this.dataForm.studyTime = data.resume.studyTime
              this.dataForm.workExperience = data.resume.workExperience
              this.dataForm.phone = data.resume.phone
              this.dataForm.email = data.resume.email
              this.dataForm.qq = data.resume.qq
              this.dataForm.wx = data.resume.wx
              this.dataForm.skill = data.resume.skill
              this.dataForm.createTime = data.resume.createTime
              this.dataForm.createBy = data.resume.createBy
              this.dataForm.updateTime = data.resume.updateTime
              this.dataForm.updateBy = data.resume.updateBy
              this.dataForm.fileUrl = data.resume.fileUrl
              this.dataForm.notes = data.resume.notes
              this.dataForm.departmentId = data.resume.departmentId
              this.dataForm.departmentName = data.resume.departmentName
              this.dataForm.status = data.resume.status
            }
          })
        }
      })
    },
    // 表单提交
    dataFormSubmit() {
      this.$refs['dataForm'].validate((valid) => {
        if (valid) {
          this.$http({
            url: this.$http.adornUrl(`/resume/resume/${!this.dataForm.id ? 'save' : 'update'}`),
            method: 'post',
            data: this.$http.adornData({
              'id': this.dataForm.id || undefined,
              'name': this.dataForm.name,
              'age': this.dataForm.age,
              'sex': this.dataForm.sex,
              'workYears': this.dataForm.workYears,
              'education': this.dataForm.education,
              'physicalCondition': this.dataForm.physicalCondition,
              'major': this.dataForm.major,
              'height': this.dataForm.height,
              'weight': this.dataForm.weight,
              'nativePlace': this.dataForm.nativePlace,
              'introduce': this.dataForm.introduce,
              'graduationSchool': this.dataForm.graduationSchool,
              'studyTime': this.dataForm.studyTime,
              'workExperience': this.dataForm.workExperience,
              'phone': this.dataForm.phone,
              'email': this.dataForm.email,
              'qq': this.dataForm.qq,
              'wx': this.dataForm.wx,
              'skill': this.dataForm.skill,
              'createTime': this.dataForm.createTime,
              'createBy': this.dataForm.createBy,
              'updateTime': this.dataForm.updateTime,
              'updateBy': this.dataForm.updateBy,
              'fileUrl': this.dataForm.fileUrl,
              'notes': this.dataForm.notes,
              'departmentId': this.dataForm.departmentId,
              'departmentName': this.dataForm.departmentName,
              'status': this.dataForm.status
            })
          }).then(({data}) => {
            if (data && data.code === 0) {
              this.$message({
                message: '操作成功',
                type: 'success',
                duration: 1500,
                onClose: () => {
                  this.visible = false
                  this.$emit('refreshDataList')
                }
              })
            } else {
              this.$message.error(data.msg)
            }
          })
        }
      })
    }
  }
}
</script>
